<template>
  <a-select
    v-model:value="state.value"
    :loading="state.loading"
    class="w-full"
    placeholder="请选择"
    :bordered="false"
    max-tag-count="responsive"
    :options="state.data"
    :mode="selectMode"
    :show-arrow="false"
    @change="onChange"
    @focus="onFocus"
  >
    <template v-if="state.loading" #notFoundContent>
      <a-spin size="small" />
    </template>
  </a-select>
</template>

<script setup>
/**
 * @name:SelectItem 选择常用字典
 */
import { reactive, watch, onMounted } from 'vue'
import { post } from '@/utils/request'

const state = reactive({
  data: [],
  loading: false
})
const emit = defineEmits(['change', 'update:value'])

const props = defineProps({
  value: {
    type: [String, Number, Array],
    default: undefined
  },
  trigger: {
    desc: '请求数据时机init:初始化/focus:聚焦',
    type: String,
    default: 'init'
  },
  defaultSelect: {
    type: String,
    default: ''
  },
  selectMode: {
    type: String,
    default: 'tags'
  },
  selectFirst: {
    type: Boolean,
    default: false
  },
  searchParams: {
    type: Object,
    default: () => ({})
  }
})
watch(
  () => props.value,
  () => {
    state.value = props.value || undefined
  },
  {
    immediate: true
  }
)
const onChange = (record, option) => {
  emit('change', option)
  emit('update:value', record)
}
//获取数据
const getData = async () => {
  state.data = []
  state.loading = true
  const { data = [], code } = await post('/outp/nurseQueue/getSchedulingDoctorList', { ...props.searchParams })
  if (code === 0) {
    state.data = data.map((item) => {
      return {
        label: item.empName,
        value: item.empId,
        roomId: item.roomId
      }
    })
    state.loading = false
    if (props.selectFirst && state.data.length > 0) {
      state.value = state.data[0].label
      emit('update:value', state.value)
    }
    if (props.defaultSelect) {
      state.value = props.defaultSelect
      emit('update:value', state.value)
    }
  }
}
const onFocus = () => {
  props.trigger === 'focus' && getData()
}
onMounted(() => {
  props.trigger === 'init' && getData()
})
</script>
<style lang="less" scoped></style>
